<div class="page-home row-content am-cf">
    <p>当前时间<?= date('Y-m-d H:i:s'); ?></p>
    <!-- 商城统计 -->
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12 am-margin-bottom">
            <div class="widget am-cf">
                <div class="widget-head">
                    <div class="widget-title">商城统计</div>
                </div>
                <div class="widget-body am-cf">
                    <div class="am-u-sm-12 am-u-md-6 am-u-lg-3" style="cursor: pointer" onclick="toMemberList()">
                        <div class="widget-card card__blue am-cf">
                            <div class="card-header">会员总数</div>
                            <div class="card-body">
                                <div class="card-value"><?= $total['agent_total'] ?></div>
                                <div class="card-description">昨日:<?= $total['yesterdayNewUser'] ?></div>
                                <span class="card-icon iconfont icon-user"></span>
                            </div>
                        </div>
                    </div>

                    <div class="am-u-sm-12 am-u-md-6 am-u-lg-3">
                        <div class="widget-card card__red am-cf">
                            <div class="card-header">订单成交</div>
                            <div class="card-body">
                                <div class="card-value"><?= $total['pay_orders'] ?></div>
                                <div class="card-description">昨天:<?= $total['yesterdayOrderCount'] ?></div>
                                <span class="card-icon iconfont icon-order"></span>
                            </div>
                        </div>
                    </div>

                    <div class="am-u-sm-12 am-u-md-6 am-u-lg-3">
                        <div class="widget-card card__red am-cf">
                            <div class="card-header">成交额</div>
                            <div class="card-body">
                                <div class="card-value"><?= $total['pay_price'] ?></div>
                                <div class="card-description">昨日:<?= $total['yesterdayTotalPay'] ?></div>
                                <span class="card-icon iconfont icon-order"></span>
                            </div>
                        </div>
                    </div>

                    <div class="am-u-sm-12 am-u-md-6 am-u-lg-3" onclick="toPayList()" style="cursor: pointer">
                        <div class="widget-card card__violet am-cf">
                            <div class="card-header">未付款</div>
                            <div class="card-body">
                                <div class="card-value"><?= $total['noPayOrderCount'] ?></div>
                                <div class="card-description">未付款的订单</div>
                                <span class="card-icon iconfont icon-order"></span>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <script>

      function toPayList() {
        location.href = "<?=url('store/order/pay_list')?>";
      }

      function toMemberList() {
        location.href = "<?=url('store/user/index')?>";
      }

      function toAgentList(level) {
        location.href = "<?=url('store/user/index')?>" + '&level=' + level;
      }
    </script>


    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12 am-margin-bottom">
            <div class="widget am-cf">
                <div class="widget-head">
                    <div class="widget-title">代理统计</div>
                </div>
                <div class="widget-body am-cf">
                    <?php foreach ($total['agent_counts'] as $level => $agent_count): ?>
                        <div class="am-u-sm-12 am-u-md-6 am-u-lg-3" style="cursor: pointer"
                             onclick="toAgentList(<?= $level ?>)">
                            <div class="widget-outline dis-flex flex-y-center">
                                <div class="outline-right dis-flex flex-dir-column flex-x-between">
                                    <div style="color: rgb(102, 102, 102); font-size: 1.3rem;"><?= $agent_count['name'] ?></div>
                                    <div style="color: rgb(51, 51, 51); font-size: 2.4rem;"><?= $agent_count['total'] ?></div>
                                </div>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>
            </div>
        </div>
    </div>
    <!-- 实时概况 -->
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12 am-margin-bottom">
            <div class="widget am-cf">
                <div class="widget-head">
                    <div class="widget-title">实时概况</div>
                </div>
                <div class="widget-body am-cf">
                    <div class="am-u-sm-3 am-u-md-3">
                        <div class="widget-outline dis-flex flex-y-center">
                            <div class="outline-left">
                                <img src=""
                                     alt="">
                            </div>
                            <div class="outline-right dis-flex flex-dir-column flex-x-between">
                                <div style="color: rgb(102, 102, 102); font-size: 1.3rem;">销售额(元)</div>
                                <div style="color: rgb(51, 51, 51); font-size: 2.4rem;"></div>
                                <div style="color: rgb(153, 153, 153); font-size: 1.2rem;">
                                    昨日：
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="am-u-sm-3 am-u-md-3">
                        <div class="widget-outline dis-flex flex-y-center">
                            <div class="outline-left">
                                <img src=""
                                     alt="">
                            </div>
                            <div class="outline-right dis-flex flex-dir-column flex-x-between">
                                <div style="color: rgb(102, 102, 102); font-size: 1.3rem;">销售额(元)</div>
                                <div style="color: rgb(51, 51, 51); font-size: 2.4rem;"></div>
                                <div style="color: rgb(153, 153, 153); font-size: 1.2rem;">
                                    昨日：
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="am-u-sm-3 am-u-md-3">
                        <div class="widget-outline dis-flex flex-y-center">
                            <div class="outline-left">
                                <img src=""
                                     alt="">
                            </div>
                            <div class="outline-right dis-flex flex-dir-column flex-x-between">
                                <div style="color: rgb(102, 102, 102); font-size: 1.3rem;">销售额(元)</div>
                                <div style="color: rgb(51, 51, 51); font-size: 2.4rem;"></div>
                                <div style="color: rgb(153, 153, 153); font-size: 1.2rem;">
                                    昨日：
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="am-u-sm-3 am-u-md-3">
                        <div class="widget-outline dis-flex flex-dir-column flex-x-between">
                            <div style="color: rgb(102, 102, 102); font-size: 1.2rem;">支付订单数</div>
                            <div style="color: rgb(51, 51, 51); font-size: 2.4rem;"></div>
                            <div style="color: rgb(153, 153, 153); font-size: 1.2rem;">
                                昨日：
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
    </div>

    <!-- 近七日交易走势 -->
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12 am-margin-bottom">
            <div class="widget am-cf">
                <div class="widget-head">
                    <div class="widget-title">近七日交易走势</div>
                </div>
                <div class="widget-body am-cf">
                    <div id="echarts-trade" class="widget-echarts" _echarts_instance_="ec_1573638075155"
                         style="-webkit-tap-highlight-color: transparent; user-select: none; position: relative; background: rgba(252, 252, 252, 0);">
                        <div style="position: relative; overflow: hidden; width: 1684px; height: 400px; cursor: default;">
                            <canvas width="1684" height="400" data-zr-dom-id="zr_0"
                                    style="position: absolute; left: 0px; top: 0px; width: 1684px; height: 400px; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);"></canvas>
                        </div>
                        <div style="position: absolute; display: none; border-style: solid; white-space: nowrap; z-index: 9999999; transition: left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s; background-color: rgba(50, 50, 50, 0.7); border-width: 0px; border-color: rgb(51, 51, 51); border-radius: 4px; color: rgb(255, 255, 255); font: 14px/21px &quot;Microsoft YaHei&quot;; padding: 5px; left: 412.933px; top: 89.625px;">
                            2019-11-08<br><span
                                    style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:#3fb1e3"></span>成交额
                            : 778.00<br><span
                                    style="display:inline-block;margin-right:5px;border-radius:10px;width:9px;height:9px;background-color:#6be6c1"></span>成交量
                            : 26
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

<script src="/assets/store/js/echarts.min.js"></script>
<script type="text/javascript">

  /**
   * 近七日交易走势
   * @type {HTMLElement}
   */
  var dom = document.getElementById('echarts-trade');
  echarts.init(dom, 'walden').setOption({
    tooltip: {
      trigger: 'axis'
    },
    legend: {
      data: ['成交量', '成交额']
    },
    toolbox: {
      show: true,
      showTitle: false,
      feature: {
        mark: {show: true},
        magicType: {show: true, type: ['line', 'bar']}
      }
    },
    calculable: true,
    xAxis: {
      type: 'category',
      boundaryGap: false,
      data: []
    },
    yAxis: {
      type: 'value'
    },
    series: [
      {
        name: '成交额',
        type: 'line',
        data: []
      },
      {
        name: '成交量',
        type: 'line',
        data: []
      }
    ]
  }, true);

</script>
